<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>地震新闻管理中心</title>
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <script src="./assets/js/loginStateCheck.js"></script>
    <link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="管理员" />
    <link rel="stylesheet" href="assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="assets/css/amazeui.datatables.min.css" />
    <link rel="stylesheet" href="assets/css/app.css">
    <link rel="stylesheet" href="./assets/css/mineModify.css">
    <link rel="stylesheet" href="./assets/font/aliicon/iconfont.css">
    <script src="assets/js/jquery.min.js"></script>
</head>

<body data-type="widgets">
<script src="assets/js/theme.js"></script>
<div class="am-g tpl-g">
    <!-- 头部 -->
    <header>
        <!-- logo -->
        <div class="am-fl tpl-header-logo">
            <a href="javascript:;">
                <h1 style="display: inline; font-family: normal">地震新闻管理中心</h1>
            </a>
        </div>
        <!-- 右侧内容 -->
        <div class="tpl-header-fluid">

            <!-- 其它功能-->
            <div class="am-fr tpl-header-navbar">
                <ul>
                    <!-- 欢迎语 -->
                    <li class="am-text-sm tpl-header-navbar-welcome">
                        <a href="javascript:;">欢迎你, <span>管理员</span> </a>
                    </li>

                    <!-- 退出 -->
                    <li class="am-text-sm">
                        <a href="../userUi/earthInfo.html">
                            <span class="am-icon-sign-out"></span> 退出
                        </a>
                    </li>
                </ul>
            </div>
        </div>

    </header>
    <!-- 侧边导航栏 -->
    <div class="left-sidebar">
        <!-- 用户信息 -->
        <div class="tpl-sidebar-user-panel">
            <div class="tpl-user-panel-slide-toggleable" style="display: flex;justify-content: center">
                <div class="tpl-user-panel-profile-picture">
                    <img src="assets/img/user04.png" alt="">
                </div>
            </div>
        </div>


        <!-- 菜单 -->
        <ul class="sidebar-nav">

            <li class="sidebar-nav-link">
                <a href="javascript:;" class="sidebar-nav-sub-title">
                    <i class="am-icon-table sidebar-nav-link-logo"></i> 数据列表
                    <span class="am-icon-chevron-down am-fr am-margin-right-sm sidebar-nav-sub-ico"></span>
                </a>
                <ul class="sidebar-nav sidebar-nav-sub" style="display: block;">
                    <li class="sidebar-nav-link">
                        <a href="index.html" class="sub-active">
                            <span class="am-icon-angle-right sidebar-nav-link-logo"></span> 地震科普文章列表
                        </a>
                    </li>
                </ul>
            </li>
            <li class="sidebar-nav-link">
                <a href="./erweima.html" class=" active">
                    <span class="iconfont icon-erweima"></span>&nbsp;&nbsp;&nbsp;&nbsp;二维码管理
                </a>
            </li>
        </ul>
    </div>
    <div class="tpl-content-wrapper">
        <ol class="am-breadcrumb">
            <li><a href="javascript:void(0);" class="am-icon-home" style="color: #999999;">首页</a></li>
            <li class="am-active">二维码管理</li>
        </ol>
        <div class="tpl-login">
            <div class="tpl-login-content">
                <div class="tpl-login-logo" style="border: 1px solid #dfdfdf;">
                    <!--<img id="qrImg" src="" width="100%" height="100%">-->
                    <a id="downloadClick" href=""></a>
                    <div id="qrImg" style="width: 100%;height: 100%;"></div>
                </div>
                <form class="am-form tpl-form-line-form">
                    <div class="am-form-group">
                        <input id="qrContent" type="text" class="tpl-form-input" placeholder="请输入网址如：https://www.baidu.com/">
                    </div>
                    <div class="am-form-group">
                        <button type="button" id="qrCreateBtn" class="am-btn am-btn-primary tpl-btn-bg-color-success  tpl-login-btn">生成</button>
                    </div>
                    <p style="color: #999999;"><span style="font-weight: 600;">提示：</span><span style="color: red;">生成完成后，请在二维码上面右键“另存为”方式下载</span></p>
                </form>
            </div>
        </div>
    </div>
    <!-- 内容区域 -->
</div>
<script src="assets/js/amazeui.min.js"></script>
<script src="assets/js/app.js"></script>
<script src="assets/js/qrcode.min.js"></script>
<script src="../common/utils.js"></script>
<script src="assets/js/adminCommon.js"></script>
<script>
    var url = "";
    $("#qrCreateBtn").on("click", function () {
        var curUrl = $("#qrContent").val();
        if (url !== curUrl) {
            $("#qrImg").html('');
            url = curUrl;
            try {
                _qrcode(url);
            } catch (e) {
                $("#qrImg").html('');
                console.log(e);
                openModal({
                    describe : '生成错误！'
                })

            }
        } else {
            openModal({
                describe : '二维码已经生成！！'
            })
        }
    })
    $("#qrDownloadBtn").on("click", function () {
        if ($('#qrImg').html){
            downloadClick();
        }
    })
</script>
</body>
</html>
